{% extends 'sales/base.html' %}
{% load static %}
{% load paginate %}
{% block breadcrumb %}

<div class="main_container">
  
  <div class="row marl heading_create">
    {% include 'mail_center.html' %}
  </div>
  
  <div class="table_container_row row marl">
    
    <div class="col-md-2 col-sm-3 col-xs-12 mail_menu">
      <div class="panel panel-default">
        <div class="panel-content">
          <ul class="mail_options">
            <li><a href="{% url 'emails:email_sent' %}">Sent Mails</a></li>
            <li><a href="{% url 'emails:email_draft' %}">Drafts</a></li>
            <li><a href="{% url 'emails:email_imp_list' %}">Important</a></li>
            <li class="active"><a href="{% url 'emails:list' %}">All</a></li>
            <li><a href="{% url 'emails:email_trash' %}">Trash</a></li>
          </ul>
        </div>
      </div>
    </div>
    
    <div class="col-md-10 col-sm-9 col-xs-12">
      
      <div class="filter_row row marl">
        <div class="panel panel-default">
          <div class="panel-heading">
            filters
          </div>
          <form method="GET" action="/emails/list/" id="filter_form" >
            <div class="panel-content">
              <div class="filter_col col-md-3">
                <div class="form-group">
                  <label for="exampleInputEmail1">Name</label>
                  <input type="text" class="form-control" placeholder="Name" value="{{request.GET.name}}" name="name">
                </div>
              </div>
              <div class="filter_col col-md-3">
                <div class="form-group">
                  <label for="exampleInputEmail1">From Date</label>
                  <input type="text" class="form-control" id="from_date" placeholder="yyyy-mm-dd" value="{{request.GET.from_date}}" name="from_date">
                </div>
              </div>
              <div class="filter_col col-md-3">
                <div class="form-group">
                  <label for="exampleInputEmail1">To Date</label>
                  <input type="text" class="form-control" id="to_date" placeholder="yyyy-mm-dd" value="{{request.GET.to_date}}" name="to_date">
                </div>
              </div>
              <div class="filter_col filter_buttons col-md-3"></div>
              <button class="btn btn-primary save" name="email_f" value="all" type="submit">Search</button>
              <a href="{% url 'emails:list' %}"><button type="button" class="btn btn-primary btn-default">Clear</button></a>
            </div>
          </form>
          <br clear="all">
        </div>
      </div>
      <div class="panel panel-default">
        <div class="panel-content">
          <table class="table table-bordered table-striped table-condensed">
            <thead>
              <tr>
                
                <th >To</th>
                <th >Subject</th>
                <th >Message</th>
                <th >Date Sent</th>
                <th >Status</th>
                <span class="pull-right total_count">Total Mails :{{filter_list.count}}</span>
              </tr>
            </thead>
            <tbody>
              {% paginate 10 filter_list as filter_list %}
              {% for fil in filter_list %}
              <tr>
                
                <td>{{fil.to_email}}</td>
                <td>{{fil.subject}}</td>
                <td><a href="{% url 'emails:email_view' fil.id %}">{{fil.message|stringformat:".5s"}}</a></td>
                <td>{{fil.send_time}}</td>
                <td>{{fil.status}}</td>
              </tr>
              {% endfor %}
            </tbody>
          </table>
          {% ifequal filter_list|length 0 %}
          <h4>
            <center>No Mails Found</center>
          </h4>
          {% else %}
          <div class="pagination_row marl row text-center">
            <nav aria-label="Page navigation">
              <ul class="pagination">
                {% show_pages %}
              </ul>
            </nav>
          </div>
          {%endifequal%}
        </div>
      </div>
      
    </div>
    <br clear="all">
  </div>
</div>

</div>
{% endblock %}
{% block js_block %}
<script type="text/javascript">
  $("#from_date,#to_date").datetimepicker({
  'format': 'YYYY-MM-DD',
  });
</script>
{% endblock js_block %}
</body>
</html>